﻿<%@ page language="java" contentType="text/html; charset=UTF-8"%>
<%
String path = request.getContextPath() + "/";
String basePath = request.getScheme() + "://"
+ request.getServerName() + ":" + request.getServerPort()
+ path;
%>
<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
	<base href="<%=basePath%>">
	<title>朗读结束</title>
	<meta http-equiv="pragma" content="no-cache">  
	<meta http-equiv="cache-control" content="no-cache">  
	<meta http-equiv="expires" content="0">  
	<meta name="viewport" content="width=device-width, initial-scale=1">
	<link rel="stylesheet" href="css/style2/d_common.css">
	<link rel="stylesheet" href="css/style2/common1.css">
	<style>
		#addGC {
			position: relative;
			width: 98%;
			margin: 0 auto;
		}
		#addGC ul li {
			margin: 5px 0.5%;
			font-size: 14px;
			text-align: center;
		}
		#addGC ul li input {
			width: 145px;
			height: 25px;
			padding: 0 5px;
			line-height: 27px;
			border: 1px solid #105A93;
			border-radius: 3px;
		}
		.but {
			display: inline-block;
			height: 40px;
			width: 100px;
			text-align: center;
			padding: 5px;
			background: #fff;
			color: #105A93;
			line-height:40px;
			border: 1px solid #105A93;
			border-radius: 5px;
			font-size: 20px;
		}
		.c-phone{
			display: inline-block;
			left: 100px;
		}
		.but2 {
			display: inline-block;
			width: 72px;
			height: 50px;
			background: #fff;
			color: #105A93;
			line-height: 50px;
			border: 1px solid #105A93;
			border-radius: 5px;
			margin: 0px;
			text-align: center;
			font-size: 24px;
		}

	</style>
</head>
<body>
<div id="back">
	<div class="header">
		<!--<div class="logo">-->
			<!--<a href="declaimer/first?guid=${guid}&devicecode=${devicecode}"><img-->
					<!--src="img/n_logo.png" alt="">-->
			<!--</a>-->
		<!--</div>-->
		<div class="logo">
			<a href="javascript:void(0);"><img src="img/n_logo.png" alt="">&nbsp;
			</a>
		</div>
		<div class="user">
			<img src="${user.pic==null?'img/man.png':user.pic==''?'img/man.png':user.pic }" alt="">
			<div class="admin">
				<span class="name">已登出</span>
			</div>
			<a class="tuichu" href="declaimer/first?guid=${guid}&devicecode=${devicecode}" style="background:#25c0f6;display: inline-block;padding: 5px;height: 30px;line-height: 30px;border-radius:5px;width: 80px;text-align: center;">返回首页</a>
		</div>
	</div>

	<div class="main">
		<div class="over-main" style="margin-bottom: 45px;">
			<div class="cont_fl">
				<div id="video">
					<div class="part-noVideo" style="height:360px;">
						<div class="artical" style="height:360px;">
							<div class="articalMain">
								<marquee id="marquee" direction="up" scrolldelay="100" behavior="scroll" contenteditable="true" scrollamount="2" width="700px" height='360px' onmouseover="this.stop();" onmouseout="this.start();">
									<p style="color:#000;">${read.content }</p>
								</marquee>
							</div>
						</div>
					</div>
					<audio src="${read.url }" style="width: 100%; height:36px;" controls="controls"> 您的浏览器不支持 video 标签。 </audio>
				</div>
			</div>
			<div class="over-tip">
				<div class="login_wx clear">
					<img
						src="https://mp.weixin.qq.com/cgi-bin/showqrcode?ticket=${ticket }"
						alt="" class="fl">
					<ol class="tipol fl">
						<li>本次朗读已经结束！</li>
						<li>如需再次朗读，扫描上图二维码重新登录！</li>
						<li>关注信昇达微信号可查看朗读记录。</li>
						<li>信昇达朗读终端</li>
					</ol>
				</div>
			</div>
		</div>
	</div>

	<div class="footer">
		<div class="read-btn">
			<a class="save-btn" onclick="saveUrl();">保存</a>
		</div>
	</div>

</div>
<div id="phone" style="display:none;font-size:16px;">
	<form id="phoneInfo">
		<div id="addGC">
			<ul>
				<li><span class="c-phone">手机号码：</span> <input type="text"
															  id="phoneno" name="phoneno" />
				</li>
				<li>
					<a class="but2" onclick="set(1);">1</a>
					<a class="but2" onclick="set(2);">2</a>
					<a class="but2" onclick="set(3);">3</a>
				</li>
				<li>
					<a class="but2" onclick="set(4);">4</a>
					<a class="but2" onclick="set(5);">5</a>
					<a class="but2" onclick="set(6);">6</a>

				</li>
				<li>
					<a class="but2" onclick="set(7);">7</a>
					<a class="but2" onclick="set(8);">8</a>
					<a class="but2" onclick="set(9);">9</a>

				</li>
				<li>
					<a class="but2" onclick="delall();">←</a>
					<a class="but2" onclick="set(0);">0</a>
					<a class="but2" onclick="delone();">D</a>
				</li>
				<li><span>是否公开你的作品供他人欣赏学习：</span> <input style="width:20px;" type="radio"
														 name="isopen" value="1" checked/>是
					<input type="radio" style="width:20px;"
						   name="isopen" value="0"/>否
				</li>
			</ul>
		</div>
	</form>
	<p id="savelubo" style="margin-top:12px;padding-top:1px;text-align: center;">
		<a class="but" onclick="savePhoneNo();">上传</a>
	</p>
</div>
<script src="js/jquery-1.9.1.js"></script>
<script src="js/layer/layer.js"></script>
<script>

var i = 600;

function Timeout(){
	if(i>0){
		i--;
		setTimeout(function(){Timeout();},1000);
	}else{
		window.location.href="<%=basePath%>declaimer/first?devicecode=${devicecode}&guid=${guid}";
	}
}
var index2;
function saveUrl(){
	index2 = layer.open({
		title : '读者手机号',
		type : 1,
		area : [ '330px', '410px' ],
		fixed : false, //不固定
		//maxmin: true,
		content : $('#phone')
	});
}
function savePhoneNo(){
	var phoneno = $("#phoneno").val();
	if(phoneno.length!=11){
		layer.msg("手机号格式不正确！");
	}else{
		$.ajax({
			async : false,
			cache : false,
			type : 'post',
			data : $("#phoneInfo").serialize(),
			dataType : "json",
			url : 'declaimer/saveReadInfo?guid=${guid}&devicecode=${devicecode }',// 请求的action路径
			error : function(XMLHttpRequest, textStatus,
					errorThrown) {
				layer.msg("请求失败！");
			},
			success : function(data1) {
				if (data1==true) {
					layer.msg("上传中，请等待几分钟后观看微信的推送的视频信息！");
					layer.close(index2);
					$(".save-btn").hide();
				}else{
					layer.msg("上传失败！");
				}
			}
		});
	}
	
}
function set(val){
	$("#phoneno").val($("#phoneno").val()+val);
}
function delall(){
	$("#phoneno").val('');
}
function delone(){
	$("#phoneno").val($("#phoneno").val().substring(0,$("#phoneno").val().length-1));
}
</script>
</body>

</html>